<template>
    <div class="view">
        <nav-bar backgroundColor="#7bbcff" color="#fff" title="讲义作业" :fixed="false">
            <div class="back" slot="left" @click="back">
                <i class="iconfont icon-fanhui"></i>
            </div>
        </nav-bar>
        <list-cell class="list-item ellipsis" :showLeftSlot="true" :showBorder="false">
            <div class="list-title" slot="leftSlot">
                <i class="iconfont icon-sifakaoshi"></i>
                我的作业
            </div>
        </list-cell>
        <list-cell class="list-item ellipsis" :showLeftSlot="true" :showBorder="false">
            <div class="list-title" slot="leftSlot">
                <i class="iconfont icon-caogao"></i>
                我的讲义
            </div>
        </list-cell>
        <list-cell class="list-item ellipsis" :showLeftSlot="true" :showBorder="false">
            <div class="list-title" slot="leftSlot">
                <i class="iconfont icon-cuotiku"></i>
                错题集
            </div>
        </list-cell>
        <list-cell class="list-item ellipsis" :showLeftSlot="true" :showBorder="false">
            <div class="list-title" slot="leftSlot">
                <i class="iconfont icon-aixin"></i>
                我的收藏
            </div>
        </list-cell>
    </div>
</template>

<script lang="ts">
    import {Component, Vue, Watch} from "vue-property-decorator";
    import Scene from "@/render/Scene";

    import NavBar from "@/components/aui/NavBar.vue";
    import ListCell from "@/components/aui/ListCell.vue";

    @Component({
        components: {
            NavBar, ListCell
        }
    })
    export default class LessonAndJob extends Scene {
        private back() {
            this.navigateBack();
        }
    }
</script>

<style scoped lang="stylus">
    .view
        background $theme-page-common-background-color;
        height 100vh;

    .list-item
        margin-top 10px;

        .list-title
            display flex;
            height 24px;
            align-items center;
            flex-direction row;
            font-size 14px;

            i.iconfont
                font-size 22px;
                display block;
                width 24px;
                text-align left;
                padding-right 10px;
                color $theme-common-color
</style>
